/* CodePen version of http://snook.ca/archives/html_and_css/simplest-css-slideshow */
body {font-family:Arial, Helvetica, sans-serif; font-size:12px;}

@keyframes fade {
  0%   { opacity: 0; }
  11.11%   { opacity: 1; }
  33.33%  { opacity: 1; }
  44.44%  { opacity: 0; }
  100% { opacity: 0; }
}

.fadein { position:relative; height:2100px; width:1300px; outline: 1px solid #000000; margin: 0 auto; }
.fadein img { position:absolute; left:0; right:0; opacity:0; animation-name: fade; animation-duration: 18s; animation-iteration-count: infinite; }
.fadein img:nth-child(1) { animation-delay: 0s;  }
.fadein img:nth-child(2) { animation-delay: 3s;  }
.fadein img:nth-child(3) { animation-delay: 6s;  }
.fadein img:nth-child(4) { animation-delay: 9s;  }
.fadein img:nth-child(5) { animation-delay: 12s;  }